import Taro, {Component} from '@tarojs/taro'
import {View, ScrollView} from '@tarojs/components'
import { AtSearchBar, AtCard } from 'taro-ui'
import moment from 'moment';
import {findEmpByNameOrCode} from './service'
import './index.scss'

export default class attendance extends Component {

  config = {
    navigationBarTitleText: '人员选择',
  };

  constructor(props) {
    super(props);
    this.state = {
      scrollHeight: 0,
      dataList: [],
      name: ''
    }
  }

  componentDidMount() {
    Taro.getSystemInfo().then(res => {
      this.setState({scrollHeight: res.windowHeight-40})
    });
  }

  onNameChange(value) {
    this.setState({name: value});
  }

  onActionClick () {
    findEmpByNameOrCode({name: this.state.name}).then(res => {
      this.setState({ dataList: res })
    })
  }

  confirmSelection = (item) => {
    let pages = Taro.getCurrentPages(); // 获取当前的页面栈
    let prevPage = pages[pages.length-2]; //  获取上一页面
    prevPage.state = { //设置上一个页面的值
      selectUserOid: item.oid,
      selectUserName: item.name
    };
    Taro.navigateBack({
      delta: 1
    });
  };

  render() {
    return (
      <View>
          <AtSearchBar
            customStyle='width: 100%; height: 60px'
            placeholder='请输入姓名进行搜索'
            showActionButton
            inputType='text'
            value={this.state.name}
            onChange={this.onNameChange.bind(this)}
            onActionClick={this.onActionClick.bind(this)}
          />
        <ScrollView
          style={'height: '+this.state.scrollHeight+'px'}
          scrollY
          scrollWithAnimation
        >
          {
            this.state.dataList &&
            this.state.dataList.map((item, index) => (
              <View className='card' key={index} style='margin: 15pt 0'>
                <AtCard title={item.name}>
                  <View className='card-content'>
                    <View className='contentItem'>
                      <View>公司:</View>
                      <View>{item.orgname}</View>
                    </View>
                    <View className='contentItem'>
                      <View>部门:</View>
                      <View>{item.unitname}</View>
                    </View>
                    <View className='contentItem'>
                      <View>岗位:</View>
                      <View>{item.jobname}</View>
                    </View>
                  </View>
                  <View className='card-btnBar'>
                    <View className='btn' onClick={() => this.confirmSelection(item)}>确认选择</View>
                  </View>
                </AtCard>
              </View>
            ))
          }
        </ScrollView>
      </View>
    )
  }
}
